@extends('admin.layout.index')


@section('content')

        <!-- Content Header (Page header) -->
        <div class="content-header">
            <div class="container-fluid">

                @if(empty($tags))

                    <div class="card">
                        <div class="card-header">
                            <h1 class="card-title">Теги отсутствуют</h1>
                        </div>
                        <!-- /.card-header -->
                        <div class="card-body">
                            <a href="{{route('tags.create')}}" class="btn btn-block btn-success btn-lg"
                               style="width: 300px">Добавить тег</a>
                        </div>
                        <!-- /.card-body -->
                    </div>

                @else

                    <div class="card">
                        <div class="card-header">
                            <h1 class="card-title">Список тегов сайта</h1>

                        </div>
                        <!-- /.card-header -->
                        <div class="card-body">
                            <div class="card-body">
                                <a href="{{route('tags.create')}}" class="btn btn-block btn-success btn-lg"
                                   style="width: 300px">Добавить тег</a>
                            </div>
                            <table class="table table-bordered">
                                <thead>
                                <tr>
                                    <th style="width: 10px">ID</th>
                                    <th>Тег</th>
                                    <th>ЧПУ Slug</th>
                                    <th style="width: 100px">Управление</th>
                                </tr>
                                </thead>
                                <tbody>

                                @foreach($tags as $tag)
                                    <tr>
                                        <td>{{$tag->id}}</td>
                                        <td>{{$tag->name}}</td>
                                        <td>{{$tag->slug}}</td>
                                        <td>
                                            <div
                                                style="display: flex;align-items: center; justify-content: space-between; width: 100%;height: 100%">
                                                <form style="margin: 0px;padding: 0px"
                                                      action="{{route('tags.destroy',  ['tag'=>$tag->id])}}"
                                                      method="post">
                                                    @csrf
                                                    @method('DELETE')
                                                    <button type="submit" class="btn btn-block btn-danger"
                                                            style="width: 40px; height: 40px;margin: 0px;padding: 5px">
                                                        <i class="fa-solid fa fa-trash"></i>
                                                    </button>
                                                </form>
                                                <a href="{{route('tags.edit', ['tag'=>$tag->id])}}"
                                                   type="button" class="btn btn-block btn-success"
                                                   style="width: 40px; height: 40px;margin: 0px;padding: 5px">
                                                    <i class='fa fa-edit'></i>
                                                </a>
                                            </div>
                                        </td>
                                    </tr>
                                @endforeach

                                </tbody>
                            </table>
                        </div>
                        <!-- /.card-body -->
                        <div class="card-footer clearfix">
                            <ul class="pagination pagination-sm m-0 float-right">
                                {{$tags->links()}}
{{--                                <li class="page-item"><a class="page-link" href="#">«</a></li>--}}
{{--                                <li class="page-item"><a class="page-link" href="#">1</a></li>--}}
{{--                                <li class="page-item"><a class="page-link" href="#">2</a></li>--}}
{{--                                <li class="page-item"><a class="page-link" href="#">3</a></li>--}}
{{--                                <li class="page-item"><a class="page-link" href="#">»</a></li>--}}
                            </ul>
                        </div>
                    </div>

                @endif
            </div>
        </div>


@endsection
<script src="http://mysite.local/adminlte/js/jquery.js"></script>
<!-- Bootstrap 4 -->
<script src="http://mysite.local/adminlte/js/bootstrap.js"></script>
<!-- AdminLTE App -->
<script src="http://mysite.local/adminlte/js/adminlte.js"></script>

<script>
    let activeLink = window.location.href;
    const menu = document.querySelectorAll('.nav-link');
    for (let i = 0; i < menu.length; i++) {
        console.log(menu[i])
        if (menu[i].href === activeLink) {
            menu[i].classList.add('active');
        }
    }
</script>
